<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>轮播预览</title>
    <link rel="stylesheet" href="/src/css/layui.css" media="all">
</head>
<body>
<blockquote class="layui-elem-quote list_search">
        <a class="layui-btn layui-btn-normal back" ><i class="layui-icon">&#xe608;</i> 返回</a>
    </div>
    <div class="layui-inline">
        <div class="layui-form-mid layui-word-aux"></div>
    </div>
</blockquote>
<div class="layui-carousel" id="test1">
    <div carousel-item>
        <div th:each="p:${preview}">
            <a th:href="@{${p.imglink}}">
                <img th:src="@{${p.imgurl}}" width="100%">
            </a>
        </div>
    </div>
</div>

<script src="/src/layui.js"></script>
<script>
    layui.use(['carousel','jquery'], function(){
        var carousel = layui.carousel;
        var $ = layui.jquery;
        //建造实例
        carousel.render({
            elem: '#test1'
            ,width: '100%' //设置容器宽度
            ,height:'600px'
            ,arrow: 'always' //始终显示箭头
            ,autoplay:true
        });
        $('.back').click(function () {
            parent.location.reload();
        })
    });
</script>
</body>
</html>